/* ====================================== 模块子路由配置  ====================================== */
import React from 'react'
import { Route, Switch, Redirect, withRouter } from 'react-router-dom'
import { CacheSwitch, CacheRoute } from 'react-cache-router'
// import CacheRoute, { CacheSwitch } from 'react-router-cache-route'
// ===================================================================== 异步加载
import Import from '@com/lazy/lazy-router'

const { $fn } = window
// ===================================================================== 深层次嵌套
const DeepRouter = ( child, component, match, path ) => {
	return	<CacheSwitch>
				<CacheRoute path={match.url + path} component={ Import(component) } exact />
				{
					child.map((v,i)=>{
						const __path = `${match.url}${path}/${v.path}`
						
						if($fn.hasArray(v.children)){
							return <CacheRoute key={__path} path={__path} render={ ({ match })=> DeepRouter( v.children, v.component, match, path + '/' + v.path ) } />
						}else{
							return <CacheRoute key={__path} path={__path} component={ Import( v.component ) } exact />
						}
					})
				}
				<Route component={ Import('404') } />
			</CacheSwitch>
}
// ===================================================================== 同步路由
const Index = ({ data, skip, match }) => {
	const { path, to } = skip || {} 		// 重定向路由
	const _to = to ? to : path
	
	return (
		<Switch>
			{
				data.map((v,i)=> {
					const { children, child } = v
					if($fn.hasArray(children)){
						return children.map((m,k)=>{
							let _component = null
							
							if(m.component){ _component = m.component }
							else{ _component =  m.path ? m.path.replace('/','') : null }
							let _path = m.url ? m.url : m.path
							// 加必选参数
							// if(m.model){ _path += '/:mid' }
							// if(m.project){ _path += '/:pid'}
							
							if(_component){
								const { child } = m
								if($fn.hasArray(child)){
									return <Route key={m + '-' + k} path={_path} render={ ({ match }) => {
										return DeepRouter(child, _component, match, '', '')
									}}/>
								}else{
									return <Route key={m + '-' + k} path={_path} component={ Import(_component) } exact/>
								}
							}else{
								// return <Route component={ Import('404') } />
								return null
							}
						})
					}else if($fn.hasArray(child)){ // 仅适用于一级菜单，且子路由不在菜单目录的路由
						let _component = null
						if(v.component){ _component = v.component }
						else{ _component =  v.path ? v.path.replace('/','') : null }
						let _path = v.url ? v.url : v.path
						
						// 加必选参数
						// if(v.model){ _path += '/:mid' }
						// if(v.project){ _path += '/:pid'}
						if(_component){
							const { child } = v
							if($fn.hasArray(child)){
								return <Route key={v + '-' + i} path={_path} render={ ({ match }) => {
									return DeepRouter(child, _component, match, '', '')
								}}/>
							}else{
								return <Route key={v + '-' + i} path={_path} component={ Import(_component) } exact/>
							}
						}else{
							return <Route component={ Import('404') } />
						}
					}else{
						const { path } = v
						if(path){
							const component = v.component ? v.component : path.replace('/','')
							return <Route key={i} path={path} component={ Import( component ) } />
						}else{
							return null
						}
					}
				})
			}
			
			{/* 重定向 */}
			{
				_to && <Route path={match.url} children={<Redirect to={_to} />}  />
			}
			{/* 404 */}
			<Route component={ Import('404') } />
		</Switch>
	)
}
export default withRouter(Index)